<template>
	<view :style="$s.view_color">
		<my-navbar :name="nav_title"></my-navbar>
		<view class="content">
			<view class="content-c">
				<view class="content-c-top color-6 fsz28">
					将海报分享给您的好友，您的好友通过扫描您的小程序码下单，你将会获得佣金。
				</view>
				<image class="qrcode-img" :src="qrcode_img" mode="widthFix"></image>
				<view class="color-3 fsz26">
					<button class="my-but-primary" @click="saveImg">保存二维码图片</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	import $agent from '@/common/agent'
	import checkLogin from '@/mixins/loginCheck.js'
	export default {
		mixins:[checkLogin],
		data () {
			return {
				nav_title:"我要推广",
				agent_conf:{},
				qrcode_img:"",
			}
		},
		onLoad () {
			this.initData()
		},
		onShow() {
		},
		computed: {
			...mapState({
				userInfo:state => state.$userInfo,
				config:state => state.$config,
				$s:state => state.$style,
			}),
		},
		methods: {
			initData(){
				this.$c.getShare(3).then(data=>{
					this.qrcode_img=data.url
				})
			},
			saveImg(){
				uni.downloadFile({
					url:this.qrcode_img,
					success: res => {
						if (res.statusCode === 200) {
							uni.saveImageToPhotosAlbum({
								filePath: res.tempFilePath,
								success: function() {
									that.comm.success('保存成功');
								},
								fail: function() {
									that.comm.error('保存失败，请稍后重试');
								}
							});
						} else {
							that.comm.error('下载失败');
						}
					}
				});
			}
		},
	}
</script>

<style lang="scss">
	@import '@/static/css/jshop.scss';
	.content-c{
		text-align: center;
		padding: 50upx 0;
		width: 80%;
		margin: 0 auto;
	}
	.content-c-top{
		text-align: left;
	}
	.qrcode-img{
		width: 500upx;
		margin: 50upx auto;
	}
</style>
